<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>电子档案系统</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="/fontawesome-free/css/all.min.css">
  <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
  <link rel="stylesheet" href="/bootstrap/bootstrap.min.css">
  <link rel="stylesheet" href="/adminlte/css/adminlte.min.css">
  <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">
</head>
<body class="hold-transition login-page">
<div class="login-box" style="width: 320px;">
  <div class="login-logo">
    <a href="../../index2.html">电子档案系统</a>
  </div>
  <div class="col-12">
    <div class="card card-primary card-tabs" style="height: 402px;">
      <div class="card-header p-0 pt-1">
        <ul class="nav nav-tabs" id="custom-tabs-one-tab" role="tablist">
          <li class="nav-item">
            <a class="nav-link active" id="custom-tabs-one-home-tab" data-toggle="pill" href="#custom-tabs-one-home" role="tab" aria-controls="custom-tabs-one-home" aria-selected="true">账户登录</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" id="custom-tabs-one-profile-tab" data-toggle="pill" href="#custom-tabs-one-profile" role="tab" aria-controls="custom-tabs-one-profile" aria-selected="false">扫码登录</a>
          </li>
        </ul>
      </div>
      <div class="card-body" style="padding: 0px;">
        <div class="tab-content" id="custom-tabs-one-tabContent">
          <div class="tab-pane fade show active" id="custom-tabs-one-home" role="tabpanel" aria-labelledby="custom-tabs-one-home-tab">
            <form action="../../index3.html" method="post" style="padding: 20px;">
              <div class="input-group mb-3 mt-4">
                <input type="number" class="form-control form-control-lg" placeholder="请输入手机号">
                <div class="input-group-append">
                  <div class="input-group-text">
                    <span class="fas fa-envelope"></span>
                  </div>
                </div>
              </div>
              <div class="input-group mb-3 mt-5">
                <input type="password" class="form-control form-control-lg" placeholder="请输入密码">
                <div class="input-group-append">
                  <div class="input-group-text">
                    <span class="fas fa-lock"></span>
                  </div>
                </div>
              </div>
              <div class="input-group mb-3 mt-5">
                <button type="submit" class="btn btn-primary btn-lg btn-block">登录</button>
                <!-- /.col -->
              </div>
            </form>
          </div>
          <div class="tab-pane fade" id="custom-tabs-one-profile" role="tabpanel" aria-labelledby="custom-tabs-one-profile-tab">
            <div id="login_container" style="text-align: center;">
            </div>
          </div>
        </div>
      </div>
      <!-- /.card -->
    </div>
  </div>
</div>
<script src="/jquery/jquery.min.js"></script>
<script src="/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="/adminlte/js/adminlte.min.js"></script>
<script src="https://g.alicdn.com/dingding/dinglogin/0.0.5/ddLogin.js"></script>
<script type="text/javascript">
  let obj = DDLogin({
    id:"login_container",//这里需要你在自己的页面定义一个HTML标签并设置id，例如<div id="login_container"></div>或<span id="login_container"></span>
    goto: encodeURIComponent('https://oapi.dingtalk.com/connect/oauth2/sns_authorize?appid=dingoacworinttrkmssroj&response_type=code&scope=snsapi_login&state=STATE&redirect_uri='+'http://113.214.16.222:1231/ddlogin'),
    style: "border:none;background-color:#FFFFFF;",
    width : "300",
    height: "350"
  });
  let handleMessage = function (event) {
    let origin = event.origin;
    console.log("origin", event.origin);
    if( origin == "https://login.dingtalk.com" ) { //判断是否来自ddLogin扫码事件。
      let loginTmpCode = event.data; //拿到loginTmpCode后就可以在这里构造跳转链接进行跳转了
      console.log("loginTmpCode", loginTmpCode);
      window.location.href='https://oapi.dingtalk.com/connect/oauth2/sns_authorize?appid=dingoacworinttrkmssroj&response_type=code&scope=snsapi_login&state=STATE&redirect_uri=http://113.214.16.222:1231/ddlogin&loginTmpCode='+loginTmpCode;
    }
  };
  if (typeof window.addEventListener != 'undefined') {
    window.addEventListener('message', handleMessage, false);
  } else if (typeof window.attachEvent != 'undefined') {
    window.attachEvent('onmessage', handleMessage);
  }

</script>
</body>
</html>
